<!DOCTYPE html>
<html lang="en">

<head>
    <script>
        try {
            if (isindex) {
            }
        } catch (e) {
            window.location.href = "/index.html";
        }
    </script>
    <!-- <script src="/js/popper.min.js"></script> -->
    <link rel="stylesheet" href="/css/resourceManage/index.css">
</head>

<body>
    <div class="resource-page">
        <div class="page-title align-items-center">
            <nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
                <ol class="breadcrumb mb-0">
                    <li class="breadcrumb-item">采集资源监管</li>
                </ol>
            </nav>
        </div>
        <div class="main-content">
            <nav>
                <ul class="nav nav-underline" id="nav-tab" role="tablist">
                    <li class="nav-link active" id="nav-home-tab" data-bs-toggle="tab" data-bs-target="#nav-home"
                        type="button" role="tab" aria-controls="nav-home" aria-selected="true">虚拟服务器</li>
                    <li class="nav-link" id="nav-profile-tab" data-bs-toggle="tab" data-bs-target="#nav-profile"
                        type="button" role="tab" aria-controls="nav-profile" aria-selected="false">账号</li>
                    <li class="nav-link" id="nav-contact-tab" data-bs-toggle="tab" data-bs-target="#nav-contact"
                        type="button" role="tab" aria-controls="nav-contact" aria-selected="false">代理池</li>
                </ul>
            </nav>
            <div class="tab-content" id="nav-tabContent">
                <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab"
                    tabindex="0">
                    <div class="input-group input-group-lg medium-input mt-3">
                        <input type="text" class="form-control search-compute" placeholder="请输入关键词进行检索">
                        <button class="btn btn-primary" type="button" onclick="searchCompute()">搜索</button>
                    </div>
                    <div class="table-list mt-3">
                        <div class="table-top">
                            <div class="table-title">资源列表</div>
                            <div class="table-btn-group">
                                <button type="button" class="btn btn-primary" onclick="addCompute()">添加计算资源</button>
                            </div>
                        </div>
                        <div class="table_mark">
                            <table class="table table-hover mt-3">
                                <thead>
                                    <tr>
                                        <th scope="col">IP地址</th>
                                        <th scope="col">机器环境</th>
                                        <th scope="col">机器配置</th>
                                        <th scope="col">CPU使用</th>
                                        <th scope="col">内存使用</th>
                                        <th scope="col">磁盘使用</th>
                                        <th scope="col">最后检测时间</th>
                                    </tr>
                                </thead>
                                <tbody class="compute-list">

                                </tbody>
                            </table>
                            <div class="table_empty" style="display: none;">暂无数据</div>
                            <!-- 加载状态 遮罩层 -->
                            <div class="modal fade marklayer">
                                <div class="load_item">
                                    <div class="spinner-border" role="status">
                                        <span class="visually-hidden"></span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div id="pagination-1"></div>
                    </div>
                </div>
                <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab"
                    tabindex="0">
                    <div class="table-list mt-3">
                        <div class="table-top">
                            <div class="table-title">账号列表</div>
                            <div class="table-btn-group">
                                <button type="button" class="btn btn-primary" onclick="addAccount()">添加账号</button>
                            </div>
                        </div>
                        <div class="table_mark">
                            <table class="table table-hover mt-3">
                                <thead>
                                    <tr>
                                        <th scope="col">用户名</th>
                                        <th scope="col">密码</th>
                                        <th scope="col">站点</th>
                                        <th scope="col">修改时间</th>
                                        <th scope="col">创建人</th>
                                        <th scope="col">状态</th>
                                        <th scope="col" class="center">操作</th>
                                    </tr>
                                </thead>
                                <tbody class="account-list">

                                </tbody>
                            </table>
                            <div class="table_empty" style="display: none;">暂无数据</div>
                            <!-- 加载状态 遮罩层 -->
                            <div class="modal fade marklayer">
                                <div class="load_item">
                                    <div class="spinner-border" role="status">
                                        <span class="visually-hidden"></span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div id="pagination-2"></div>
                    </div>
                </div>
                <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab"
                    tabindex="0">
                    <div class="table-list mt-3">
                        <div class="table-top">
                            <div class="table-title">代理池列表</div>
                            <div class="table-btn-group">
                                <button type="button" class="btn btn-primary" onclick="addAgent()">添加代理</button>
                            </div>
                        </div>
                        <div class="table_mark">
                            <table class="table table-hover mt-3">
                                <thead>
                                    <tr>
                                        <th scope="col">服务商</th>
                                        <th scope="col">有效期</th>
                                        <th scope="col">链接</th>
                                        <th scope="col">状态</th>
                                        <th scope="col">创建人</th>
                                        <th scope="col">更新时间</th>
                                        <th scope="col" class="center">操作</th>
                                    </tr>
                                </thead>
                                <tbody class="agentpools-list">

                                </tbody>
                            </table>
                            <div class="table_empty" style="display: none;">暂无数据</div>
                            <!-- 加载状态 遮罩层 -->
                            <div class="modal fade marklayer">
                                <div class="load_item">
                                    <div class="spinner-border" role="status">
                                        <span class="visually-hidden"></span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div id="pagination-3"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal fade" id="deleteAccountModal" tabindex="-1" aria-labelledby="deleteAccountModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header" style="padding: 20px 20px 10px; border: none">
                        <div class="modal-title" id="stopTaskModalLabel" style="
                    line-height: 24px;
                    font-size: 18px;
                    color: #303133;
                  ">
                            提示
                        </div>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <form onsubmit="return false;">
                            <div class="form-group">
                                <div class="col-form-label" style="color: #606266; font-size: 14px">
                                    确定要删除吗？
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer" style="border: none">
                        <button type="button" class="btn btn-primary" onclick="submitDeleteAccount()">确定</button>
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal fade" id="deleteAgentpoolsModal" tabindex="-1" aria-labelledby="deleteAccountModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header" style="padding: 20px 20px 10px; border: none">
                        <div class="modal-title" id="stopTaskModalLabel" style="
                line-height: 24px;
                font-size: 18px;
                color: #303133;
              ">
                            提示
                        </div>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <form onsubmit="return false;">
                            <div class="form-group">
                                <div class="col-form-label" style="color: #606266; font-size: 14px">
                                    确定要删除吗？
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer" style="border: none">
                        <button type="button" class="btn btn-primary" onclick="submitDeleteAgentpools()">确定</button>
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal fade " id="addAccountModal" tabindex="-1" aria-labelledby="addAccountModalLabel"
            aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h1 class="modal-title fs-5" id="exampleModalLabel">添加账号</h1>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form class="row  needs-validation account-form" novalidate onsubmit="return false;"
                        style="--bs-gutter-x:0">
                        <div class="modal-body">
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom01">用户名：</label>
                                <input type="text" class="form-control username" id="validationCustom01" value=""
                                    placeholder="请输入用户名(必填)" required>
                                <div class="invalid-feedback">
                                    用户名不能为空
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom02" class="form-label">密码：</label>
                                <input type="text" class="form-control password" id="validationCustom02" value=""
                                    placeholder="请输入密码(必填)" required>
                                <div class="invalid-feedback">
                                    密码不能为空
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom03" class="form-label ">站点：</label>
                                <input type="url" class="form-control site" id="validationCustom03"
                                    placeholder="请输入站点(必填)" required>
                                <div class="invalid-feedback">
                                    站点格式不正确
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary">确定</button>
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="modal fade " id="addAgentModal" tabindex="-1" aria-labelledby="addAgentModalLabel"
            aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h1 class="modal-title fs-5" id="exampleModalLabel">添加代理</h1>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form class="row  needs-validation agent-form" novalidate onsubmit="return false;"
                        style="--bs-gutter-x:0">
                        <div class="modal-body">
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom04">服务商：</label>
                                <input type="text" class="form-control server-name" id="validationCustom04" value=""
                                    placeholder="请输入服务商(必填)" required>
                                <div class="invalid-feedback">
                                    服务商不能为空
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom05" class="form-label">有效期：</label>
                                <input type="text" class="form-control effective-date" id="validationCustom05"
                                    placeholder="请选择截止日期(必填)" required>
                                <div class="invalid-feedback">
                                    请选择截止日期
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom06" class="form-label">链接：</label>
                                <input type="url" class="form-control url" id="validationCustom06"
                                    placeholder="请输入链接(必填)" required>
                                <div class="invalid-feedback">
                                    链接格式不正确
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary">确定</button>
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="modal fade " id="editAccountModal" tabindex="-1" aria-labelledby="editAccountModalLabel"
            aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h1 class="modal-title fs-5" id="exampleModalLabel">账号编辑</h1>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form class="row  needs-validation edit-account-form" novalidate onsubmit="return false;"
                        style="--bs-gutter-x:0">
                        <div class="modal-body">
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom07">用户名：</label>
                                <input type="text" class="form-control new-username" id="validationCustom07" value=""
                                    placeholder="请输入用户名(必填)" required>
                                <div class="invalid-feedback">
                                    用户名不能为空
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom08" class="form-label">密码：</label>
                                <input type="text" class="form-control new-password" id="validationCustom08" value=""
                                    placeholder="请输入密码(必填)" required>
                                <div class="invalid-feedback">
                                    密码不能为空
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom09" class="form-label">站点：</label>
                                <input type="url" class="form-control new-site" id="validationCustom09"
                                    placeholder="请输入站点(必填)" required>
                                <div class="invalid-feedback">
                                    站点格式不正确
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary">确定</button>
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div class="modal fade " id="editAgentModal" tabindex="-1" aria-labelledby="editAgentModalLabel"
            aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header">
                        <h1 class="modal-title fs-5" id="exampleModalLabel">代理编辑</h1>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <form class="row  needs-validation edit-agent-form" novalidate onsubmit="return false;"
                        style="--bs-gutter-x:0">
                        <div class="modal-body">
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom10">服务商：</label>
                                <input type="text" class="form-control new-server-name" id="validationCustom10" value=""
                                    placeholder="请输入服务商(必填)" required>
                                <div class="invalid-feedback">
                                    服务商不能为空
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom11" class="form-label">有效期：</label>
                                <input type="text" class="form-control new-effective-date" id="validationCustom11"
                                    placeholder="请选择截止日期(必填)" required>
                                <div class="invalid-feedback">
                                    请选择截止日期
                                </div>
                            </div>
                            <div class="form-group" style="margin-bottom: 0;padding: 15px 0;">
                                <label for="validationCustom12" class="form-label">链接：</label>
                                <input type="url" class="form-control new-url" id="validationCustom12"
                                    placeholder="请输入链接(必填)" required>
                                <div class="invalid-feedback">
                                    链接格式不正确
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary">确定</button>
                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <script src="/js/intercept.js"></script>
    <script src="/js/resourceManage/compute.js"></script>
    <script src="/js/resourceManage/account.js"></script>
    <script src="/js/resourceManage/agentpools.js"></script>
</body>

</html>